<template>
  <view>
    <view v-for="item in financeList" :key="item.todoId">
      <u-card
        :show-head="false"
        border-radius="32"
        margin="20rpx 0"
        @click="gotoDetails(item)"
      >
        <view slot="body">
          <view class="font-bold u-font-32 u-m-b-20 u-line-3 u-text-color">
            <template>
              {{ item.createTime }}
            </template>
          </view>
          <view
            v-for="el in labelValueList"
            :key="el.prop"
            class="u-m-t-10 u-line-1"
          >
            <text class="u-tips-color">{{ el.label }}：</text>
            <text class="u-content-color">{{ item[el.prop] }}</text>
          </view>
        </view>
        <view slot="foot">
          <view class="u-flex u-row-between u-padding-20 u-p-l-32 u-p-r-32">
            <u-tag
              shape="circle"
              text="经费调整"
              :bg-color="'#fef0f0'"
              :color="'#fa3534'"
              border-color="transparent"
            />
            <view>
              <u-text
                :class="[
                  'u-type-' + FUNDS_STATUS_MAP[item.status]?.color,
                  'font-bold',
                ]"
                >{{ FUNDS_STATUS_MAP[item.status]?.label }}</u-text
              >
            </view>
          </view>
        </view>
      </u-card>
    </view>

    <u-loadmore :status="status" :load-text="loadText" />
  </view>
</template>
<script lang="ts" setup>
import { getFundAdjustList } from '@/api/modules/project';
import { onLoad, onReachBottom } from '@dcloudio/uni-app';
import { FUNDS_STATUS_MAP } from '@/enums/financeEnum';

const labelValueList = [
  {
    label: '申请人',
    prop: 'createUserName',
  },
];
const props = defineProps<{
  current: any;
}>();

const { current } = toRefs(props);

const status = ref('loadmore');
const loadText = {
  loadmore: '加载更多',
  loading: '努力加载中',
  nomore: '没有更多了',
};

const scroll = () => {};
const scrolltoupper = () => {
  if (current.value !== 3) {
    console.log('在其他tab');
    return;
  }
  queryData.pageNum += 1;
  console.log('触底了');
  if (status.value === 'nomore') {
    console.log('没有更多了');
    return;
  }
  getList();
};
onReachBottom(() => {
  console.log('-------------onReachBottom');

  scrolltoupper();
});

const financeList = ref<any>([]);
const listTotla = ref(0);
const loading = ref<boolean>(false);
const getList = async () => {
  loading.value = true;
  try {
    let res: any = await getFundAdjustList({
      ...queryData,
    });
    financeList.value = financeList.value.concat(res.list);
    listTotla.value = res.total;
    if (financeList.value.length === listTotla.value) {
      status.value = 'nomore';
    } else {
      status.value = 'loadmore';
    }
    loading.value = false;
    console.log(financeList.value, 'financeList');
  } catch {
    loading.value = false;
  }
};

const objData = ref<any>({});
const queryData = reactive<any>({
  pageNum: 1,
  pageSize: 10,
});

const gotoDetails = (item: any) => {
  (uni as any).$Router.push({
    name: 'fundAdjust',
    params: {
      data: {
        taskId: item.adjustId,
        projectId: item.projectId,
      },
    },
  });
};

onLoad(() => {
  const { params } = (uni as any).$Router.getQuery();
  objData.value = JSON.parse(decodeURIComponent(params));
  queryData.projectId = objData.value.projectId;
  financeList.value = [];
});
const resetTable = () => {
  queryData.pageNum = 1;
  listTotla.value = 0;
  financeList.value = [];
  getList();
};
defineExpose({
  resetTable,
});
</script>
